<template>
  <div :class="['com-button',type?type:'']" @click="onClick">
      <slot></slot>
  </div>
</template>

<script>
    export default{
        name:'comButton',
        methods:{
            onClick(e){
                console.log('---');
                this.$emit('click1',e);
            }
        },
        props:{
            type:{
                type:String,
                required:false
            }            
        }

    }

</script>

<style scoped lang="scss">
    .com-button{
        width: 80px;
        height: 40px;
        line-height: 40px;
        background: #ff8040;
        border-radius: 10px;
        color: white;
        cursor: pointer;
        &:hover{
            background: #00ff00;
        }
        &:active{
            background: black;
        }
    }
    .error{
        background: red;
        &:hover{
            background: #00ff00;
        }
        &:active{
            background: black;
        }
    }
</style>
